<script>
export default {
  name: "add-button",
  props: {
    num: {
      type: Number,
      required: true
    }
  },
  methods: {


    minus() {
      // this.$emit("minus");


      let num = this.num;

      if (num < 2) {
        return;
      }
      num--;
      this.$emit("change", num)
    },
    plus() {
      // this.$emit("plus")


      let num = this.num;
      num++;
      this.$emit("change", num)
    },
  }
}
</script>

<template>
  <div class="number-box">
    <button @click.stop="minus">-</button>
    <p>{{ num }}</p>
    <button @click.stop="plus">+</button>
  </div>
</template>

<style scoped>

.number-box {
  display: flex;
  float: right;


  button { /* 添加或去掉购物车 */
    height: 20px;
    width: 20px;
    border-radius: 50%;
    background: none;
    margin: 0;
    padding: 0;
    border: 2px solid #ff9900;
  }

  p {
    padding: 0 10px;
    margin: 0;
  }
}

</style>